<!--
    * Time    : 2020-12-28 16:59:08
    * Author  : zhangTj
    * Desc    : 充值记录详情页面
-->

<template>
    <div class="w750">
        <div class="h-100 bg-fff pt-1">
            <div class="mt-2 px-3 font-14">
                <div class="d-flex mb-2">
                    <span style="width: 85px;" class="text-right">充值单号：</span>
                    <span class="flex-2 ml-1">{{ detailData.rechargeNumber }}</span>
                </div>
                <div class="d-flex mb-2">
                    <span style="width: 85px;" class="text-right">本金：</span>
                    <span class="flex-2 ml-1">￥{{ money(detailData.amount)[0] }}.{{ money(detailData.amount)[1] }}</span>
                </div>
                <div class="d-flex mb-2">
                    <span style="width: 85px;" class="text-right">赠送金：</span>
                    <span class="flex-2 ml-1">￥{{ money(detailData.additionalAmount)[0] }}.{{ money(detailData.additionalAmount)[1] }}</span>
                </div>
                <div class="d-flex mb-2">
                    <span style="width: 85px;" class="text-right">充值礼包：</span>
                    <span class="flex-2 ml-1">{{ detailData.rechargeGiftpackInfo || '无' }}</span>
                </div>

                <div class="d-flex mb-2">
                    <span style="width: 85px;" class="text-right">状态：</span>
                    <span class="flex-2 ml-1">{{ statusDict[detailData.rechargeStatus] }}</span>
                </div>
                <div class="d-flex mb-2">
                    <span style="width: 85px;" class="text-right">充值时间：</span>
                    <span class="flex-2 ml-1">{{ detailData.createTime | dateformat }}</span>
                </div>
                <div class="d-flex mb-2">
                    <span style="width: 85px;" class="text-right">支付金额：</span>
                    <span class="flex-2 ml-1">￥{{ money(detailData.amount)[0] }}.{{ money(detailData.amount)[1] }}</span>
                </div>
                <div class="d-flex mb-2">
                    <span style="width: 85px;" class="text-right">支付时间：</span>
                    <span class="flex-2 ml-1" v-if="detailData.payTime">{{ detailData.payTime | dateformat }}</span>
                    <span class="flex-2 ml-1" v-else>-</span>
                </div>

                <div class="d-flex mb-2">
                    <span style="width: 85px;" class="text-right">交易流水号：</span>
                    <span class="flex-2 ml-1">{{ detailData.flowTradeNo || '-' }}</span>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import { predepositrechargeDetail } from '@/api/balance'
import cash from 'utils/tool'

export default {
    name: '',
    components: {},
    data() {
        return {
            recordId: '', // 充值id
            detailData: {}, // 详情数据
            statusDict: {
                1: '待支付',
                2: '已支付',
                3: '取消'
            },
            money: cash
        }
    },
    computed: {},
    watch: {},
    created() {},
    destroyed() {},
    mounted() {
        this.recordId = this.$route.query.recordId
        this.getDetail()
    },
    methods: {
        getDetail() {
            predepositrechargeDetail({
                rechargeNumber: this.recordId
            })
                .then((res) => {
                    this.detailData = res.result
                })
                .catch((err) => {
                })
        }
    }
}
</script>

<style lang="scss" scoped></style>
